﻿﻿<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>y2wIM Web Demo</title>
    <link rel="shortcut icon" href="images/logo.ico">
    <link rel="stylesheet" href="css/base.css"/>
    <link rel="stylesheet" href="css/animate.css"/>
    <link rel="stylesheet" href="css/jquery-ui.css"/>
    <link rel="stylesheet" href="css/main.css"/>
</head>
<body id="chatbody">
<div class="wrapper box-sizing">
    <div class="content">
        <!-- 左 -->
        <div class="left-panel">
            <div class="title">
                <span class="logo"></span>
                    <span class="avatar avatar-me hide" id="myAvatar" >
					    <img src="" alt=""/>
                    </span>

                <span class="hide"><img src="images/pen.png" class="u-modify" id="showMyInfo"></span>
                <span class="exit" title="退出" id="j-logout">退出</span>
                <span id="networkStatus" cltabass="status"></span>

            </div>
            <div class="search" id="searchpanel">
                <div class="input">
                    <div class="icon">搜索</div>
                    <input type="text" />
                    <div class="search-close">×</div>
                </div>
                <div class="tab-panel hide">
                    <ul class="list"></ul>
                </div>
            </div>
            <div class="tab tab-3" id="tab">
                <a href="javascript:;" data-type=0><span class="userconversation cur"></span></a>
                <a href="javascript:;" data-type=1><span class="contact"></span></a>
                <a href="javascript:;" data-type=2><span class="group"></span></a>
            </div>
            <div class="tab-panel" id="userConversationPanel" data-type=0>
                <ul class="list"></ul>
            </div>
            <div class="tab-panel hide" id="contactPanel" data-type=1>
                <div class="custom-item add-contact" id="addFriend">
                    <div class="item-avatar">
                        <img  class="panel_image" src="images/contact_add.png" alt="添加好友"/>
                    </div>
                    <div class="item-text">
                        <p class="single-row color-white">添加好友</p>
                    </div>
                </div>
                <ul class="list"></ul>
            </div>
            <div class="tab-panel hide" id="groupPanel" data-type=2>
                <ul class="list"></ul>
            </div>
        </div>
        <!-- 右 -->
        <div class="right-panel" id="rightPanel">
            <div class="chat-box hide">
                <div class="title" id="chatTitle">
                    <img src="" width="56" height="56" class="radius-circle img hide" id="headImg"/>
                    <span id="chatName" class="name"></span>
                    <span class="btn-chat-info hide" id="btnChatInfo"></span>
                </div>
                <div class="chat-info hide" id="chatInfo">
                    <div class="chat-members" id="chatMembers">
                        <div class="chat-member hide" id="addChatMembers">
                            <span class="tool plus"></span>
                        </div>
                        <div class="chat-member hide" id="removeChatMembers">
                            <span class="tool sub"></span>
                        </div>
                    </div>
                    <ul class="chat-nav" id="chatNav">
                        <li class="hide" id="editContactTitle">
                            <span class="title">备注</span>
                            <span class="text"></span>
                            <input class="single hide"/>
                            <button class="editor btn btn-edit radius5px fr hide">修改</button>
                            <button class="ok btn btn-ok radius5px fr hide">确定</button>
                            <button class="cancel btn btn-cancel radius5px fr hide">取消</button>
                        </li>
                        <li class="hide" id="editGroupTitle">
                            <span class="title">群名称</span>
                            <span class="text"></span>
                            <input class="single hide"/>
                            <button class="editor btn btn-edit radius5px fr hide">修改名称</button>
                            <button class="ok btn btn-ok radius5px fr hide">确定</button>
                            <button class="cancel btn btn-cancel radius5px fr hide">取消</button>
                            <button class="editor btn btn-cancel radius5px fr hide">修改头像</button>
                        </li>
                        <li class="hide" id="chatGroupNickName">
                            <span class="title">我在本群的昵称</span>
                            <span class="text" id="chatGroupNickNameText"></span>
                            <input class="single hide" id="chatGroupNickNameInput"/>
                            <span class="editor" id="chatGroupNickNameEditor"></span>
                        </li>
                        <li class="favorite hide" id="chatFavorite">
                            <span class="title">收藏到群列表</span>
                            <div class="switch">
                                <img src="images/btn_switch.png">
                                <span class="off">&nbsp;off</span>
                                <span class="on">on&nbsp;</span>
                            </div>
                        </li>
                    </ul>
                    <div class="chat-quit hide" id="chatQuit">
                        <button class="btn btn-del radius4px hide" id="btnChatQuit"></button>
                    </div>
                </div>

                <div class="chat-content-wrap box-sizing" id="j-chatContentWrap">
                    <div class="chat-content box-sizing" id="j-chatContent">
                    </div>
                </div>
                <div class="chat-mask"></div>
                <div class="chat-editor box-sizing" id="j-chatEditor" data-disabled="1">
                        <span class="msg-type" id="j-emoji">
                            <a href="javascript:;" class="icon icon-emoji"></a>
                        </span>
						<span class="msg-type" id="j-msgType">
							<a href="javascript:;" class="icon icon-file" data-type="file"></a>
						</span>
                    <form action="#" id="j-uploadForm">
                        <input multiple="multiple" type="file" accept="*/*" name="file" id="j-uploadFile" class="hide"/>
                    </form>
                    <textarea id="j-messageText" class="msg-input box-sizing radius5px" rows="1" autofocus="autofocus" placeholder="给小伙伴说些什么吧..."></textarea>
                    <a href="javascript:;" class="btn-send radius4px" id="j-sendBtn">发送</a>
                </div>
            </div>
            <div class="emoji-card" id="emojier">
                <div class="emoji-card-body">
                    <div class="emoji-item">

                    </div>
                </div>
                <div class="emoji-card-tabs">
                    <div class="emoji-card-tab"></div>
                </div>
            </div>
            <div class="browser hide" id="browserpanel">
                <input type="text" id="d123" class="date hide"/>
                <input type="file" id="browserImage" accept="image/*" class="hide"/>
                <input type="file" id="browserFile" accept="*/*" class="hide"/>
                <div class="toolbar"  >
                    <span class="tbtn btn_back hoverBtn">‹</span>
                    <span class="tbtn btn_close hoverBtn">×</span>
                    <span class="name">这是标题</span>
                    <div class="opbtns" id="otherBtns">

                    </div>
                    <div class="opbtns downbtns hide" id="downBtns">

                    </div>
                    <div class="opbtns" id="defaultBtns">
                        <a class="opbtn hoverBtn" target="_blank">新窗口打开</a>
                    </div>
                </div>
                <div class="container">
                    <iframe></iframe>
                </div>
                <div  class="browser-over hide">
                    <p>
                        <i class="iconfont">&#xe601;</i>
                        <span>正在加载...</span>
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="callvideo_bg hide">
    <div class="callvideo_title_bg">
        <span class="callvideo_title_text" id="callvideo_title_text">视频通话邀请</span>
        <img class="callvideo_title_img" id="callvideo_title_img" />
    </div>
    <div class="callvideo_content_bg">
        <div>
            <img id="callvideo_content_userimg" class="callvideo_content_userimg" onerror="javascript: this.src = 'images/contact_avatar.png'" />
        </div>
        <div class="callvideo_content_username" id="callvideo_content_username">
            <span></span>
        </div>
        <div class="callvideo_content_userinfo" id="callvideo_content_userinfo">
            <span></span>
        </div>
        <div class="callvideo_buttom_handup" id="callvideo_buttom_handup">
            <span class="callvideo_buttom_text">挂断</span>
        </div>
        <div class="callvideo_buttom_call" id="callvideo_buttom_call">
            <span class="callvideo_buttom_text">接听</span>
        </div>
    </div>
</div>
<div class="main-footer tc">
    <p>Copyright &copy;2016 liyueyun.com</p>
</div>

<!-- 退出确认框 -->
<div class="dialog radius5px hide" id="j-logoutDialog">
    <span class="close" id="j-closeDialog"></span>
    <div class="content tc">确定要退出yun2win吗？</div>
    <div class="buttons tc">
        <button class="btn radius4px btn-cancel" id="j-cancelBtn">取消</button>
        <button class="btn radius4px btn-ok" id="j-okBtn">确定</button>
    </div>
</div>
<!-- 添加好友 -->
<div class="m-dialog hide" id="addFriendBox">
    <div class="title box-sizing">
        添加好友
        <i class="close"></i>
    </div>
    <div class="content tc">
        <input type="text" class="ipt radius5px box-sizing j-account" placeholder="请输入帐号"/>
        <div class="info f-cb">
            <div class="item-avatar">
                    <span class="avatar avatar-add-contact">
                        <img src="">
                    </span>
            </div>
            <div class="desc">
                <p class="j-nickname"></p>
                <p><span class="j-username"></span></p>
                <span class="j-uid hide"></span>
            </div>
        </div>
        <div class="tip">
        </div>
    </div>
    <div class="btns tc">
        <button class="btn btn-cancel radius4px cancel j-close">取消</button>
        <button class="btn btn-ok radius4px search j-search">确定</button>
        <button class="btn btn-cancel radius4px back j-back">继续搜索</button>
        <button class="btn btn-ok radius4px add j-add">加为好友</button>
        <button class="btn btn-ok radius4px done j-close">完成</button>
        <button class="btn btn-ok radius4px chat j-chat">聊天</button>
        <button class="btn btn-del radius4px blacklist j-blacklist">移出黑名单</button>
    </div>
</div>

<!-- 用户卡片 -->
<div class="hide" id="userInfo">
    <div class="u-card-over"></div>
    <div class="u-card">
        <div class="u-card-head">
            <img class="u-head"   />
            <span class="u-name hide">姓名</span>
        </div>
        <div class="u-card-attrs">
            <div class="u-card-attr u-remark" >
                <label>姓名</label>
                <span>无</span>
            </div>
            <div class="u-card-attr u-account">
                <label>帐号</label>
                <span>aaa@qq.com</span>
            </div>
        </div>
        <div class="u-card-btns">
            <div class="u-card-btn u-send">发消息</div>
            <div class="u-card-btn u-add hide">添加到联系人</div>
        </div>
    </div>
</div>
<!-- 个人信息 -->
<div class="m-card m-card-1 hide" id="myInfo">
    <i class="close"></i>
    <div class="uInfo f-cb">
            <span class="avatar avatar-user-info">
			    <img class="u-icon modifyAvatar j-modifyAvatar" src="" alt="更换头像">
            </span>
        <div class="desc">
            <p class="j-nickname nick"></p>
            <img src="" class="j-gender gender">
            <p><span class="j-username"></span></p>
        </div>
    </div>
    <div class="infos">
        <div class="operate">
            <span class="edit j-edit">编辑</span>
            <span class="edit j-editPassword">更改密码</span>
            <span class="savepassword j-savePassword">确认</span>
            <span class="save j-save">保存</span>
            <span class="cancel j-cancel"> 取消</span>
        </div>
        <div class="tt">基本信息</div>
        <div class="showUI">
            <div class="items">
                <div class="item">手机</div>
                <div class="j-tel"></div>
            </div>
        </div>
        <div class="editUI">
            <div class="items">
                <div class="item">昵称</div>
                <input type="text" class="e-nick ipt" maxlength="10">
            </div>
            <div class="items">
                <div class="item">手机</div>
                <input type="text" class="e-tel ipt ipt-1" maxlength="13">
            </div>
        </div>
        <div class="editUI-password">
            <div class="items">
                <div class="item">密码</div>
                <input type="password" class="e-psw ipt" maxlength="20">
            </div>
            <div class="items">
                <div class="item">新密码</div>
                <input type="password" class="e-npsw ipt" maxlength="20">
            </div>
            <div class="items">
                <div class="item">重复新密码</div>
                <input type="password" class="e-rnpsw ipt" maxlength="20">
            </div>
        </div>
    </div>
</div>
<div id="mask" class="mask hide"></div>
<div id="browserMask" class="mask hide">
    <span class="browserMaskUploading">上传中...</span>
</div>
<!-- js-->
<script src="js/3rd/jquery-1.7.1.min.js"></script>
<script src="js/3rd/jquery-ui-datepicker.js"></script>
<script src="js/3rd/EventEmitter.js"></script>
<script src="js/3rd/My97DatePicker/WdatePicker.js"></script>
<script src="js/3rd/jquery.contextmenu.js?v=0.1"></script>
<script src="js/3rd/jquery.cropit.js"></script>
<script src="js/3rd/async.js"></script>
<script src="js/3rd/ajaxFileUpload.js"></script>
<script src="js/3rd/md5.js"></script>
<script src="js/3rd/char.js"></script>
<script src="js/common/utils.js"></script>
<script src="js/core/config.js?v=0.1"></script>
<script src="js/core/utils.js?v=0.1"></script>
<script src="js/core/user.js?v=0.1"></script>
<script src="js/core/userConversation.js?v=0.1"></script>
<script src="js/core/contact.js?v=0.1"></script>
<script src="js/core/emoji.js?v=0.1"></script>
<script src="js/core/message.js?v=0.1"></script>
<script src="js/core/userSession.js?v=0.1"></script>
<script src="js/core/sessionMember.js?v=0.1"></script>
<script src="js/core/session.js?v=0.1"></script>
<script src="js/core/attachment.js?v=0.1"></script>
<script src="js/core/y2wIMSDK.min.js"></script>
<script src="js/widget/y2wIMBridge.js"></script>
<script src="js/widget/tab.js?v=0.1"></script>
<script src="js/widget/chooseAvatar.js?v=0.1"></script>
<script src="js/widget/chatInfo.js?v=0.1"></script>
<script src="js/widget/userInfo.js?v=0.1"></script>
<script src="js/widget/emojier.js?v=0.1"></script>
<script src="js/widget/maper.js?v=0.1"></script>
<script src="js/widget/networker.js?v=0.1"></script>
<script src="js/widget/searcher.js?v=0.1"></script>
<script src="js/widget/selector.js?v=0.1"></script>
<script src="js/widget/chat.js?v=0.1"></script>


<script src="js/main.js?v=0.1"></script>



<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls">
    <div class="slides"></div>
    <h3 class="title"></h3>
    <a class="prev">‹</a>
    <a class="next">›</a>
    <a class="close">×</a>
    <div class="rotate">
        <div class="rotate-left" title="向左旋转"></div>
        <div class="rotate-right" title="向右旋转"></div>
    </div>
    <a class="play-pause"></a>
    <ol class="indicator"></ol>
</div>
<link rel="stylesheet" href="js/3rd/blueimp/dest/blueimp-gallery.min.css"/>
<script src="js/3rd/blueimp/dest/jquery.blueimp-gallery.min.js"></script>


<!--地理位置-->
<div id="mapContainer" class="hide">
    <div class="map-over"></div>
    <div id="container"></div>
    <div class="map-close">×</div>
</div>



</body>
</html>